<template>
	<view class="content">
		<!-- 轮播图 -->
		<view class="swiper">
			<ls-swiper :list="list2" imgKey="image" :crown="true" :loop="true" :autoplay='true' :shadow='true' :height='130' :previousMargin="120"
			 :nextMargin='120' :imgRadius="5" />
		</view>
		
		<!-- 热门活动 -->
		<view>
			<view class="promotion">
				<view class="text">优惠专区</view>
				<view class="list">
					<view class="column" >
						<view class="top">
							<view class="title">标题</view>
							<!-- <view class="countdown" v-if="row.countdown">
								<view>{{ row.countdown.h }}</view>
								:
								<view>{{ row.countdown.m }}</view>
								:
								<view>{{ row.countdown.s }}</view>
							</view> -->
						</view>
						<view class="left">
							<view class="ad">收到发发发</view>
							<view class="into">点击进入</view>
						</view>
						<view class="right"><image src="/static/image//circle/s1.jpg"></image></view>
					</view>
					<view class="column" >
						<view class="top">
							<view class="title">标题</view>
							<!-- <view class="countdown" v-if="row.countdown">
								<view>{{ row.countdown.h }}</view>
								:
								<view>{{ row.countdown.m }}</view>
								:
								<view>{{ row.countdown.s }}</view>
							</view> -->
						</view>
						<view class="left">
							<view class="ad">收到发发发</view>
							<view class="into">点击进入</view>
						</view>
						<view class="right"><image src="/static/image//circle/s1.jpg"></image></view>
					</view>
				</view>
			</view>
			
		</view>
		<!-- 热门应用 -->
		<view>
			<o-grid  gutter title="热门应用">
				<o-grid-item text="内容标题" badge="99+" icon="/static/logo.png" />
				<o-grid-item text="内容标题" icon="icon-brand-fill" />
				<o-grid-item text="内容标题" dot icon="/static/logo.png" />
			</o-grid>
		</view>
		<!-- 常用应用 -->
		<view class="v-tabs-grid">
			<v-tabs class="v-tabs" v-model="current" :tabs="tabs" @change="changeTab"></v-tabs>
			<view class="" v-show="current == 0">
				<o-grid col="4" gutter>
					<o-grid-item text="小微主页" @click="goTo('/pages/wechart/index/index')"  icon="/static/image/wechat-icon/shouye-shouye.png"></o-grid-item>
					<o-grid-item text="单聊" badge="99+" icon="/static/image/wechat-icon/xiaoxi-zhihui.png"></o-grid-item>
					<o-grid-item text="群聊" dot icon="/static/image/wechat-icon/shejishi.png"></o-grid-item>
					<o-grid-item text="转账" icon="/static/image/wechat-icon/zhuanzhang.png"></o-grid-item>
					<o-grid-item text="红包" icon="/static/image/wechat-icon/hongbao.png"></o-grid-item>
					<o-grid-item text="聊天背景" icon="/static/image/wechat-icon/beijingse.png"></o-grid-item>
					<o-grid-item text="群发助手" icon="/static/image/wechat-icon/shezhi.png"></o-grid-item>
					<o-grid-item text="账单" icon="/static/image/wechat-icon/zhangdan.png"></o-grid-item>
					<o-grid-item text="新的朋友" icon="/static/image/wechat-icon/tianjiapengyou.png"></o-grid-item>
					<o-grid-item text="零钱通" icon="/static/image/wechat-icon/qiandai.png"></o-grid-item>
					<o-grid-item text="朋友圈" icon="/static/image/wechat-icon/iconfontzhizuobiaozhunbduan36.png"></o-grid-item>
					
					<o-grid-item text="提现" icon="/static/image/wechat-icon/tixian.png"></o-grid-item>
					<o-grid-item text="微信支付" icon="/static/image/wechat-icon/weixinzhifu.png"></o-grid-item>
					<o-grid-item text="账单详情" icon="/static/image/wechat-icon/wj-zd.png"></o-grid-item>
					<o-grid-item text="支付成功" icon="/static/image/wechat-icon/zhifuchenggong.png"></o-grid-item>
					<o-grid-item text="账单统计" icon="/static/image/wechat-icon/tongji.png"></o-grid-item>
				</o-grid>
			</view>
			<view class="" v-show="current == 1">
				11
			</view>
			<view class="" v-show="current == 2">
				22
			</view>
			
			
		</view>
		
	</view>
</template>

<script>
	import LsSwiper from '@/components/ls-swiper/index.vue'
	import HmFriendInformationCard from '@/components/hm-friend-information-card/index.vue'
	// #ifdef VUE2

	export default {
		components: {
			LsSwiper,
			HmFriendInformationCard,
		},
		data() {
			return {
				list2: [{
				    image: 'https://cdn.uviewui.com/uview/swiper/swiper2.png',
				    title: '昨夜星辰昨夜风，画楼西畔桂堂东',
				},{
				    image: 'https://cdn.uviewui.com/uview/swiper/swiper1.png',
				    title: '身无彩凤双飞翼，心有灵犀一点通'
				},{
				    image: 'https://cdn.uviewui.com/uview/swiper/swiper3.png',
				    title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳'
				}],
				current: 0,
				tabs: ['小微', '小Q', '小宝'],
				text1: 'uView UI众多组件覆盖开发过程的各个需求，组件功能丰富，多端兼容。让您快速集成，开箱即用'
			}
		},
		onLoad() {
			
		},
		methods: {
			
			loaded() {
				console.log('加载完成')
			},
			changeTab(index){
				console.log("12131:" + index)
			},
			goTo(url,type){
				switch (type) {
					case 'tabbar':{ //跳转到tabbar页
						uni.switchTab({ url:url })
						break;
					}
					case 'back':{ //返回上一页，只有当前为非tabbar页起作用
						uni.navigateBack({ delta:1 });
						break;
					}
					case 'modal':{ //弹出对话框
						uni.showModal({
							title:url,
							content:'test'
						});
						break;
					}
					case 'toast':{ //弹出提示框
						uni.showToast({
							icon:'none',
							title:url
						});
						break;
					}
					default:{ //非tabbar页跳转
						if (!url) { console.log('没填写路径!') }
						else {
							uni.navigateTo({ url:url});
						}
					}
				}
			}
			
			
		}
	}
	// #endif
</script>
<style lang="scss" scoped>
 @import './home.scss'
 
 
</style>
